﻿@inherits BaseComponent

<h1>@Language["Login.WithAccount"]</h1>
<ValidateForm Model="@Model">
    <div class="boot-row">
        <BootstrapInputGroup>
            <BootstrapInputGroupIcon Icon="fa fa-user" />
            <BootstrapInput DisplayText="" @bind-Value="@Model.UserName" PlaceHolder="@Language["UserName"]" />
        </BootstrapInputGroup>
    </div>
    <div class="boot-row">
        <BootstrapInputGroup>
            <BootstrapInputGroupIcon Icon="fa fa-lock" />
            <BootstrapPassword DisplayText="" @bind-Value="@Model.Password" PlaceHolder="@Language["Password"]" />
        </BootstrapInputGroup>
    </div>
    <div class="boot-row">
        <BootstrapInputGroup>
            <BootstrapInputGroupIcon Icon="fa fa-check" />
            <BootCaptcha @ref="captcha" DisplayText="" @bind-Value="@Model.Captcha" PlaceHolder="@Language["Captcha"]" />
        </BootstrapInputGroup>
    </div>
    <div class="boot-row">
        <Switch @bind-Value="@Model.Remember" OnText="@Language["Login.RememberUser"]" OffText="@Language["Login.RememberUser"]" />
    </div>
    <div class="boot-row">
        <Button Color="Color.Primary" OnClick="OnUserLogin" IsBlock>@Language["Login"]</Button>
    </div>
</ValidateForm>

<style>
    .boot-row {margin-bottom:20px;}
    .boot-row .form-label {display:none;}
</style>

@code {
    private BootCaptcha captcha;

    [Parameter] public LoginFormInfo Model { get; set; }
    [Parameter] public Func<Task> OnLogin { get; set; }

    private async Task OnUserLogin()
    {
        if (!captcha.Validate(out string message))
        {
            await UI.Toast(message, StyleType.Error);
            //return;
        }

        await OnLogin?.Invoke();
    }
}